<div class="col-lg-6">
	<div class="panel panel-default">
		<div class="panel-body" style = "background: #CEE3F6">
			<div class="col-lg-12"><h2>Nuevo Centro de Investigación</h2><br/><br/></div>
			<div class="col-xs-12">
				<form id ="myForm" role="form" action="insertar_registro.php" onsubmit="return validar();" method="post">
					<div class="form-group col-xs-8">
						<label>Nombre&nbsp;<span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/></label>
						<input type="text" class="form-control" name="nombre" required>
					</div>
					<div id="id" class="form-group col-xs-4">
						<label>Siglas&nbsp;<span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/></label>
						<input type="text" class="form-control" name="id" required>
					</div>
					<div class="form-group col-xs-4">
			          	</br><label><span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/>&nbsp;Campos obligatorios</label>
					</div>
					<div class="col-xs-12"></br></div>
					<div class="col-xs-4"></div>
					<div class="col-xs-4">
						<button type="submit" id="agregar" class="btn btn-primary form-control">Agregar</button>
					</div>
					<div class="col-xs-4"></div>
					<div class="col-xs-12"></br></div>
					<input type="hidden" name="tabla" value="centro">
				</form>
			</div>
		</div>
	</div>
</div>

<script>
$('[name=id]').keyup(function (e) {
	var code = $(this).val(); 
	if(/^[A-Z]+$/.test(code)) $("#id").removeClass("has-error");
	else $("#id").addClass("has-error");

});

function validar()
{
	var code = $('[name=id]').val();
	if(!/^[A-Z]+$/.test(code)) alert("Uno o más campos inválidos!\nVerífiquelos antes de continuar.");
	return (/^[A-Z]+$/.test(code));
}

$("#agregar").click(function(){return confirm("¿Está seguro que desea continuar?")});
</script>